﻿<span style="font-size:18px;"><!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
 
<title>某管理系统</title>
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
 
<style>
	body{
		margin-top: 65px;
	}
	.col-md-2{
    background-color: #ccc;
    /*?*/
    height: 600px;
    color: #DDB2B3;
	}
	#left-content{
		margin-top: 20px;
	}
	.list-group{
		padding-left: 0;
	}
	#panel-group{
		margin-top: 20px;
	}
	#onebtn{
		margin: 10px 0;
	}
	#btngroup button{
		width: 100%;
	}
	.progress{
		margin-top: 15px;
	}
 
</style>
 
</head>
 
<body>
<nav class="navbar navbar-default navbar-fixed-top navbar-inverse" role="navigation">
	<div class="container">
		<div class="navbar-header">
			<button type="button" class="navbar-toggle collapsed" 
						data-toggle="collapse" data-target="#demo-navbar">
				<span class="sr-only">Toggle navigation</span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
			</button>
			<a class="navbar-brand" href="#">QQ登录系统&nbsp;</a>
		</div>
		<div class="collapse navbar-collapse" id="demo-navbar">
			<ul class="nav navbar-nav">
				<li class="active"><a href="#">说说&nbsp;</a></li>
				<li class="dropdown">
					<a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="caret">日志</span></a>
						<ul class="dropdown-menu" role="menu">
							<li class="dropdown-header">信息</li>
							<li><a href="#">我的好友</a></li>
							<li><a href="#">个性化</a></li>
							<li><a href="#">背景音乐</a></li>
						</ul>
				</li>
				
				<li><a href="#" data-toggle="modal" data-target="#about">留言</a></li>
                <li><a><input type="text" placeholder="QQ用户名" class="form-control"/></a></li>
                <li><a><input type="text" placeholder="QQ密码" class="form-control"/></a></li>
                <li><a><button type="button" class="btn btn-default">QQ登陆</button></a></li>
                
			</ul>
		</div>
	</div>
</nav>
 
<div class="container-fluid">
	<div class="row">
		<div class="col-md-2">
			<div class="text-center" id="left-content">
				<div class="list-group">
					<a href="#" class="list-group-item active">首页</a>
				</div>
				<div class="list-group">
					<a href="#" class="list-group-item">&nbsp;</a>
					<a href="#" class="list-group-item">我的好友</a>
					<a href="#" class="list-group-item">个性化</a>
					<a href="#" class="list-group-item">好友生日</a>
					<a href="#" class="list-group-item">情侣空间</a>
				</div>
				<div class="list-group">
					<a href="#" class="list-group-item">QQ设置</a>
					<a href="#" class="list-group-item">QQ帮助</a>
				</div>
			</div>
		</div>
 
		<div class="col-md-10">
			<h2><a href="https://user.qzone.qq.com/2979914674/infocenter">管理控制台</a></h2>
			<hr class="divider">
			
  			<button type="button" class="btn btn-default">说说</button>
  			<button type="button" class="btn btn-primary">日志</button>
  			<button type="button" class="btn btn-success">相册</button>
  			<button type="button" class="btn btn-info">留言</button>
  			<button type="button" class="btn btn-warning">访客</button>
  			<button type="button" class="btn btn-danger">进入官网</button>
 
  			<div id="panel-group">
 
  				<!-- 1 -->
  				<div class="panel panel-primary">
  					<div class="panel-heading">
  						<h3 class="panel-title">空间提醒</h3>
  					</div>
  					<div class="panel-body">
  						<div class="alert alert-info" role="alert">
  						
  							<strong>提示1</strong> 您的好友不酷但很撩访问了您的空间
  						</div>
  						<div class="alert alert-danger" role="alert">
  							<strong>提示2</strong> 您的黄钻已到期，请及时缴费
  						</div>
  						<div class="alert alert-warning" role="alert">
  							<strong>提示</strong> 您的好友送您10000元转账，请及时查收
  						</div>
  					</div>
  					
  				</div>
 
  				<!-- 2 -->
  				<div class="panel panel-primary">
  					<div class="panel-heading">
  						<h3 class="panel-title">留言板</h3>
							<select name="haoyouliuyan"	>
								<option value="hahaha">哈哈哈</option>
								<option value="xixixi">嘻嘻嘻</option>
								<option value="lalalal">啦啦啦</option>
								</sele>		
  					</div>
  					<div class="panel-body" id="btngroup">
  						<div>
  						  <button class="btn btn-primary" type="button"><span class="pull-left">设置个性钻</span><span class="badge pull-right"></span></button></div>
  						<div id="onebtn"><button class="btn btn-primary" type="button"><span class="pull-left">查看好友资料卡</span><span class="badge pull-right"></span></button></div>
  						<div><button class="btn btn-primary" type="button"><span class="pull-left">关于我们</span><span class="badge pull-right"></span></button></div>
  					</div>
  				</div>				

</body>
</html></span>